<template>
  <div class="page-container">
    <div class="toolbar" style="float:left;padding-top:10px;">
      <el-form :inline="true" :size="size" :model="searchForm">
        <el-form-item>
          <el-date-picker v-model="searchForm.sTime" type="date" :size="size" value-format="yyyy-MM-dd" placeholder="选择开始时间" :picker-options="pickerOptionsStart" style="margin-right: 10px;">
          </el-date-picker>
          至
          <el-date-picker v-model="searchForm.eTime" type="date" :size="size" value-format="yyyy-MM-dd" placeholder="选择结束时间" :picker-options="pickerOptionsEnd" style="margin-left: 10px;">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <kt-button icon="fa fa-search" :label="$t('action.search')" perms="rb:dailyRecord:list" type="primary" @click="queryActiveList(true)" />
        </el-form-item>
      </el-form>
    </div>
    <cs-table :table-data="tableData"
              :table-label="tableLabel"
              @handleButton="handleButton"
              :loading="loading"
              :isSelection="isSelection"
              :table-option="tableOption">
      <template slot="status" slot-scope="audits">
        <sapn>{{scope.row.audits ? scope.row.audits : '暂无审核记录'}}</sapn>
      </template>
    </cs-table>
        <el-pagination
          @size-change="sizeChangeHandle"
          @current-change="currentChangeHandle"
          :current-page="pageRequest.pageNo"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="pageRequest.pageSize"
          :total="totalPage"
          layout="total, sizes, prev, pager, next, jumper"
          style="text-align: right; margin-top: 10px"
        >
        </el-pagination>
    <edit-daily ref="addOrUpdate" v-if="addOrUpdateVisible"></edit-daily>
  </div>
</template>
<script>
  import KtButton from "@/views/Core/KtButton"
  import {queryDailyRecord} from "@/api/dailyweekly/workflow"
  import EditDaily from './edit-daily'
  export default {
    data() {
      return {
        size: window.SITE_CONFIG.tableSize,
        pickerOptionsStart: {
          disabledDate: time => {
            let endDateVal = this.searchForm.eTime
            if (endDateVal) {
              return time.getTime() > new Date(endDateVal).getTime()
            }
          }
        },
        pickerOptionsEnd: {
          disabledDate: time => {
            let beginDateVal = this.searchForm.sTime
            if (beginDateVal) {
              return (
                time.getTime() < new Date(beginDateVal).getTime() - 1 * 24 * 60 * 60 * 1000
              )
            }
          }
        },
        searchForm: {
          sTime: '',
          eTime: ''
        },
        isSelection: false,
        tableData: [],
        loading: true,
        addOrUpdateVisible: false,
        editDailyVisible: false,
        tableLabel: [
          { label: '日报内容', param: 'content', align: 'center', isShow: true},
          { label: '时间', param: 'recordTime', align: 'center', isShow: true, width: '120px'},
        ],
        tableOption: {
          label: '操作',
          width: '300',
          options: [
            { label: '查看', type: '', icon: 'el-icon-view', methods: 'view', auth: 'rb:dailyRecord:info' }
          ]
        },
        pageRequest: {
          pageNo: 1,
          pageSize: 10
        },
        totalPage: 0
      }
    },
    components: {
      KtButton,
      EditDaily,
      'CsTable': () => import('@/components/cs-table')
    },
    created () {
      this.queryActiveList()
    },
    methods: {
      async queryActiveList (init) {
        if (init) {
          this.pageRequest.pageNo = 1
        }
        const { pageSize, pageNo } = this.pageRequest
        const  {sTime, eTime} = this.searchForm
        const parms = {
          pageSize,
          pageNo,
          sTime,
          eTime
        }
        this.loading = true
        const data = await queryDailyRecord(parms)
        if (data) {
          if (data.code === 200) {
            this.tableData = data.data.rows
            this.totalPage = data.data.totalRows
            this.loading = false
          } else {
            this.loading = false
            this.tableData = []
          }
        }
      },
      handleButton (methods) {
        if (methods.methods === 'view') {
          this.addOrUpdateVisible = true
          this.$nextTick(() => {
            this.$refs.addOrUpdate.init(methods.row.id, true)
          })
        }
      },
      sizeChangeHandle (val) {
        this.pageRequest.pageSize = val
        this.pageRequest.pageNo = 1
        this.queryActiveList(true)
      },
      currentChangeHandle (val) {
        // console.log(val, 'val')
        this.pageRequest.pageNo = val
        this.queryActiveList()
      }
    }
  }
</script>
